<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html>
<html lang="en">
<head>
<base href="<%=basePath%>">
<meta charset="utf-8" />
<title></title>

<meta name="description" content="overview & stats" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="static/css/bootstrap.min.css" />
<link rel="stylesheet" href="static/css/bootstrap-responsive.min.css" />
<link rel="stylesheet" href="static/css/font-awesome.min.css" />
<!--[if IE 7]><link rel="stylesheet" href="css/font-awesome-ie7.min.css" /><![endif]-->
<!--[if lt IE 9]><link rel="stylesheet" href="css/ace-ie.min.css" /><![endif]-->
<link rel="stylesheet" href="static/css/ace.min.css" />
<link rel="stylesheet" href="static/css/ace-responsive.min.css" />
<link rel="stylesheet" href="static/css/ace-skins.min.css" />

<!-- 
<script type="text/javascript" src="js/jquery-1.7.2.js"></script>
 -->
<script type="text/javascript" src="static/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
	window.jQuery
			|| document
					.write("<script src='js/jquery-1.9.1.min.js'>\x3C/script>");
</script>
<script type="text/javascript" src="static/js/bootstrap.min.js"></script>
<script type="text/javascript" src="static/js/ace-elements.min.js"></script>
<script type="text/javascript" src="static/js/ace.min.js"></script>
<script type="text/javascript" src="static/js/bootbox.min.js"></script>
<!--引入弹窗组件start-->
<script type="text/javascript" src="plugins/attention/zDialog/zDrag.js"></script>
<script type="text/javascript" src="plugins/attention/zDialog/zDialog.js"></script>
<!--引入弹窗组件end-->

<script type="text/javascript">
	$(top.hangge());	
	//新增
	function addModule(){
		 top.jzts();
		 var diag = new top.Dialog();
		 diag.Drag=true;
		 diag.Title ="新增模块";
		 diag.URL = '<%=basePath%>/wxmenu/toAdd.do';
		 diag.Width = 250;
		 diag.Height = 270;
		 diag.CancelEvent = function(){ //关闭事件
			if(diag.innerFrame.contentWindow.document.getElementById('centerOfMainFrame').style.display == 'none'){
				top.jzts(); 
				setTimeout("location.reload()",100);
			}
			diag.close();
		 };
		 diag.show();
	}
	
	//修改
	function editModule(moduleid){
		 top.jzts();
	   	 var diag = new top.Dialog();
		 diag.Drag=true;
		 diag.Title ="编辑模块";
		 diag.URL = '<%=basePath%>/wxmenu/toEdit.do?moduleid='+moduleid;
		 diag.Width = 250;
		 diag.Height = 270;
		 diag.CancelEvent = function(){ //关闭事件
			if(diag.innerFrame.contentWindow.document.getElementById('centerOfMainFrame').style.display == 'none'){
				top.jzts(); 
				setTimeout("location.reload()",100);
			}
			diag.close();
		 };
		 diag.show();
	}
	
	function delModule(moduleid, isParent){
		var flag = false;
		if(isParent){
			if(confirm("确定要删除该模块吗？其下子模块及相关的操作权限将一并删除！")){
				flag = true;
			}
		}else{
			if(confirm("确定要删除该模块及相关的操作权限吗？")){
				flag = true;
			}
		}
		if(flag){
			var url = "<%=basePath%>/wxmenu/del.do?moduleid="+moduleid+"&guid="+new Date().getTime();
			$.get(url, function(data) {
				if (data == "success") {
					top.jzts();
					document.location.reload();
				} else if (data == "false2") {
					alert("删除失败，请先删除此模块与角色的关联关系!");
					return false;
				} else if (data == "false3") {
					alert("删除失败，请先删除此模块下操作权限与角色的关联关系!");
					return false;
				}
			});
		}
	}
	
	function openClose(moduleid,curObj,trIndex){
		var txt = $(curObj).text();
		if(txt=="展开"){
			$(curObj).text("折叠");
			$("#tr"+moduleid).after("<tr id='tempTr"+moduleid+"'><td colspan='5'>数据载入中</td></tr>");
			if(trIndex%2==0){
				$("#tempTr"+moduleid).addClass("main_table_even");
			}
			var url = "<%=basePath%>/wxmenu/sub.do?moduleid="+moduleid+"&guid="+new Date().getTime();
			$.get(url,function(data){
				if(data.length>0){
					var html = "";
					$.each(data,function(i){
						html = "<tr style='height:24px;line-height:24px;' name='subTr"+moduleid+"'>";
						html += "<td></td>";
						html += "<td><span style='width:80px;display:inline-block;'></span>";
						if(i==data.length-1)
							html += "<img src='static/images/joinbottom.gif' style='vertical-align: middle;'/>";
						else
							html += "<img src='static/images/join.gif' style='vertical-align: middle;'/>";
						html += "<span style='width:100px;text-align:left;display:inline-block;'>"+this.modulename+"</span>";
						html += "</td>";
						html += "<td>"+this.moduleurl+"</td>";
						html += "<td class='center'>"+this.moduleorder+"</td>";
						html += "<td class='center'>"+this.module_type+"</td>";
						html += "<td><a class='btn btn-mini btn-info' title='编辑' onclick='editModule(\""+this.moduleid+"\")'><i class='icon-edit'></i></a> <a class='btn btn-mini btn-danger' title='删除' onclick='delModule(\""+this.moduleid+"\",false)'><i class='icon-trash'></i></a></td>";
						html += "</tr>";
						$("#tempTr"+moduleid).before(html);
					});
					$("#tempTr"+moduleid).remove();
					if(trIndex%2==0){
						$("tr[name='subTr"+moduleid+"']").addClass("main_table_even");
					}
				}else{
					$("#tempTr"+moduleid+" > td").html("没有相关数据");
				}
			},"json");
		}else{
			$("#tempTr"+moduleid).remove();
			$("tr[name='subTr"+moduleid+"']").remove();
			$(curObj).text("展开");
		}
	}
	
	//显示加载进度
	function jzts(){
		$("#jzts").show();
	}
	
	function generateWXMenu(){
		bootbox.confirm("确定生成微信自定义菜单吗?", function(result) {
			if(result) {
				var url = "<%=basePath%>/wxmenu/generateWXMenu.do?tm="+ new Date().getTime();
				$.get(url,function(data){
					//alert(data);
					//if(data=="success"){
						//top.jzts();
						bootbox.alert("操作成功！");
						//alert("生成成功！");
						//setTimeout("self.location.reload()", 100);
					//}
				});
			}
		});
	}
</script>
</head>

<body>
	<div class="container-fluid" id="main-container">
		<div id="breadcrumbs">
			<ul class="breadcrumb">
				<li><i class="icon-home"></i> <a>权限管理</a> <span class="divider">
						<i class="icon-angle-right"></i>
				</span></li>
				<li class="active">公众号菜单</li>
			</ul>
			<!--.breadcrumb-->
		</div>
		<!--#breadcrumbs-->
		<div class="page-header position-relative">
			<div>
				&nbsp;&nbsp;&nbsp;&nbsp;<a class="btn btn-small btn-success"
					onclick="addModule();">新增</a>
			</div>
		</div>
		<div id="page-content">
			<div class="row-fluid">
					<table id="table_report"
						class="table table-striped table-bordered table-hover">
						<thead>
							<tr>
								<th class="center" style="width: 50px;">序号</th>
								<th class='center'>名称</th>
								<th class='center'>模块路径</th>
								<th class='center'>排序</th>
								<th class='center'>事件类型</th>
								<th class='center'>操作</th>
							</tr>
						</thead>
						<c:choose>
							<c:when test="${not empty moduleList}">
								<c:forEach items="${moduleList}" var="module" varStatus="vs">
									<tr id="tr${module.moduleid }">
										<td class="center">${vs.index+1}</td>
										<td class='center'>${module.modulename }&nbsp;
										<td>${module.moduleurl == '#'? '': module.moduleurl}</td>
										<td class='center'>${module.moduleorder }</td>
										<td class='center'>
											<c:if test="${module.module_type=='no'}">无</c:if>
											<c:if test="${module.module_type=='click'}">click（点击推事件）</c:if>
											<c:if test="${module.module_type=='view'}">view（跳转URL）</c:if>
										</td>
										<td style="width: 25%;">
											<a class='btn btn-mini btn-warning' onclick="openClose('${module.moduleid }',this,${vs.index })">展开</a>
											<a class='btn btn-mini btn-info' title="编辑" onclick="editModule('${module.moduleid }')"><i class='icon-edit'></i></a> 
											<a class='btn btn-mini btn-danger' title="删除" onclick="delModule('${module.moduleid }',true)"><i class='icon-trash'></i></a>
										</td>
									</tr>
								</c:forEach>
							</c:when>
							<c:otherwise>
								<tr>
									<td colspan="100">没有相关数据</td>
								</tr>
							</c:otherwise>
						</c:choose>
					</table>
				<!--/row-->
				<div class="name" style="margin-top: 20px;">
				    <span class="input-group-btn">
				 		<a class="btn btn-small btn-success" onclick="generateWXMenu();">&nbsp;&nbsp;生成微信自定义菜单</a>
				 	</span>
				</div>
			</div>
		</div>
		<!--/#page-content-->
	</div>
	<!--/.fluid-container#main-container-->
</body>
</html>